%ol.breadcrumb
  %li
    %i.fa.fa-dashboard.fa-prl5
    = link_to admin_root_path do
      管理首页
  %li.active
    %i.fa.fa-columns.fa-prl5
    分类管理
#admin-column-index
  = form_for [:admin, @column], remote: true do |f|
    .table-responsive
      %table.table.table-bordered.table-hover.table-striped
        %thead
          %tr
            %th ID
            %th 名称
            %th 标识符
            %th 文章数
            %th 创建时间
            %th 操作
        %tbody.columns-content
          - @columns.each do |c|
            %tr{id: "column-#{c.id}"}
              %td.id
                = c.id
              %td.name{style:'width: 25%'}
                = c.name
              %td.ident{style:'width: 25%'}
                = c.ident
              %td
                = c.posts_count rescue 0
              %td
                = c.created_at.localtime.strftime("%x %H:%M")
              %td.operate-icons
                .fa.fa-pencil-square.fa-prl5.has-tooltip{ 'data-original-title' => '修改此分类', 'data-placement' => 'top', 'data-toggle' => 'tooltip', onclick: "editColumn(#{c.id})"}
                = link_to admin_column_path(c), method: :delete, remote: true, data: {confirm: '删除后，此分类下的所有文章将会无分类，确认删除？'}, class: 'has-tooltip', 'data-original-title' => '删除此分类', 'data-placement' => 'top', 'data-toggle' => 'tooltip' do
                  .fa.fa-trash.fa-pr5
                = link_to c, class:'has-tooltip overview', 'data-original-title' => '查看', 'data-placement' => 'top', 'data-toggle' => 'tooltip', target: '_blank' do
                  .fa.fa-eye
          %tr.columns-create-field
            %td
            %td
              = f.text_field :name, class: 'form-control', placeholder: '如: Web开发', required: true
            %td
              = f.text_field :ident, class: 'form-control', placeholder: '如: web_dev', required: true
            %td{colspan: 3}
              = f.submit '创建', class: 'btn btn-success margin-right-5'
              .btn.btn-default.cancle-create-field
                取消
          %tr.add-columns-btn
            %td.td-button{colspan: 6}
              .fa.fa-plus.fa-pr5.table-bottom-btn
                添加分类
= paginate @columns, remote: true

:coffee
  $('.add-columns-btn').click ->
    $('.add-columns-btn').hide()
    $('.columns-create-field').show()
    return
  $('.cancle-create-field').click ->
    $('.add-columns-btn').show()
    $('.columns-create-field').hide()
    return
  $('#new_column').submit ->
    $('input[type=submit]', this).attr 'disabled', 'disabled'
    return

:javascript
  function editColumn(id){
    column = $('#column-'+id)
    name = column.find('.name').text()
    ident = column.find('.ident').text()
    html = "<tr id='edit-column-" + id + "'><td>" + id + "<input type='hidden' name='column_id' id='column_id' value='" + id + "'></td><td style='width: 25%'><input type='text' name='name' id='name' value='" + name + "' class='form-control'></td><td style='width: 25%'><input type='text' name='ident' id='ident' value='" + ident + "' class='form-control'></td><td colspan='3'><div class='btn btn-success margin-right-5' onclick='updateColumn(" + id + ")'>修改</div><div class='btn btn-default cancle-edit-field' onclick='cancleEdit(" + id + ")'>取消</div></td></tr>"
    column.after(html)
    column.hide()
  }
  function cancleEdit(id){
    $('#edit-column-' + id).remove()
    $('#column-'+id).show()
  }
  function updateColumn(id){
    edit_column = $('#edit-column-'+id)
    column = $('#column-'+id)
    name = edit_column.find('#name').val()
    ident = edit_column.find('#ident').val()
    if(name == '' || ident == ''){
      alert('名称或标示符不能为空')
      return
    }
    $.ajax({
      url: '/admin/columns/update_column',
      data: {'id': id,'column[name]': name, 'column[ident]': ident},
      type: "PUT",
      beforeSend: function(data) {
        edit_column.find('.btn-success').append('<i class="fa fa-spinner fa-pulse fa-fw"></i>')
      },
      success: function(data) {
        if(data.status == '1'){
          column.find('.overview').attr('href', data.data.path)
          edit_column.remove()
          column.find('.name').text(name)
          column.find('.ident').text(ident)
          column.show()
        }else{
          alert(data.message)
        }
      }
    })
  }
